<script  setup >
import { onMounted, ref } from 'vue'
import sideBar from './SideBar.vue'
import NavBar from './NavBar.vue'
import AppMain from './AppMain.vue'
const data = ref('')


onMounted(()=>{})


</script>
<template>
  <div class="page-box">
        <el-container >
          <el-aside width="200px" >
            <side-bar/>
          </el-aside>
          <el-container >
            <el-header>
              <nav-bar />
            </el-header>
            <el-main>
              <app-main />
            </el-main>
          </el-container>
        </el-container>
      </div>
</template>

<style scoped lang='scss'>
.page-box{
  width: 100%;
  height: 100%;
  .el-container {
  height: 100%;
  .el-main{
    height: 100%;
    width: 100%;
  }
}
  
}
</style>